<template>
	<div class="headerWrap">
		<router-link to="/" class="logo">
			<img src="../../assets/logo.png"/>
		</router-link>
		<router-link to="/search" class="icon_sousuo">
			<svg>
				<use xlink:href="#icon-sousuo"></use>
			</svg>
		</router-link>
		<router-link to="/space" class="icon_space">
			<div class="space"></div>
		</router-link>
		<a class="download" href="https://itunes.apple.com/cn/app/bi-li-bi-li-dong-hua/id736536022">
			下载 App
		</a>
	</div>
</template>

<script>
</script>

<style lang="scss" type="text/css">
@import "~@/common/scss/common";
.headerWrap{
	display: flex;
	flex-direction: row;
	-webkit-box-orient: horizontal;
	align-items:center;
	justify-content:space-between;
	position: fixed;
	top: 0;
	width: 100%;
	height: 40px;
	padding: 12px 0;
	background-color:#fff;
	z-index:5;
	.logo{
		display: block;
		width: 90px;
		margin-left:5%;
		img{
			display: block;
			width: 100%;
		}
	}
	.icon_sousuo{
		width: 26px;
		height: 26px;
		margin-left: 30%;
		margin-right: 3%;
		svg{
			width: 100%;
			height: 100%;
			fill: #aaa;
		}
	}
	.icon_space{
		display: block;
		width: 26px;
		height: 26px;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 4%;
		.space{
			width: 100%;
			height: 100%;
			background: url(../../assets/noface.gif) center/contain no-repeat ;
		}
	}
	.download{
		width: 80px;
		height: 26px;
		line-height: 26px;
		font-size: 12px;
		text-align: center;
		color: #fff;	
		background-color:$maincolor ;
		border-radius: 4px;	
		margin-right: 4%;
	}
}
	
</style>